<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">

<head>
    <link rel="shortcut icon" type="image/x-icon" th:href="@{/img/details.png}">
    <meta charset="UTF-8">
    <title>限时抢购</title>
    <style type="text/css">
        .m_info{
            padding: 0 10px;
            height: 36px;
            line-height: 36px;
            color: #fff;
            background-color: #e36844;
        }
        #dv{
            color: #fff0ff;
            font-size: 16px;
            font-weight: bold;
            width:320px;
            padding: 5px;
            /*border:2px solid salmon;*/
            text-align: center;
        }
    </style>
    <link rel="stylesheet" type="text/css" th:href="@{/css/swiper-4.3.5.min.css}" href="css/swiper-4.3.5.min.css" />
    <link rel="stylesheet" type="text/css" th:href="@{/css/reset.css}" href="css/reset.css" />
    <link rel="stylesheet" type="text/css" th:href="@{/css/goods-details.css}" href="css/goods-details.css" />
    <link rel="stylesheet" type="text/css" th:href="@{/css/head.css}" href="css/head.css" />
</head>

<body>
<div th:replace="head::topbar"></div>
<div class="container">
    <div class="goods-list">
        <span>首页</span>
        <p class="pict"><img height="12" th:src="@{/img/xbt-4_03.png}" /></p>
        <span><a href="goods-list.html">电器</a></span>
        <p class="pict"><img height="12" th:src="@{/img/xbt-4_03.png}" /></p>
        <span><a href="goods-list.html">生活电器</a></span>
        <p class="pict"><img height="12" th:src="@{/img/xbt-4_03.png}" /></p>
        <span>便携式投影仪</span>
    </div>
    <div class="detailHd">
        <form action="/indent/shopping-pay-rightnow" method="post" onsubmit="return buyJudgment()">
            <input type="hidden" name="customerId" th:value="${session.customerId}"/>
            <input type="hidden" id="productId" name="productId" th:value="${activity.productId}"/>
            <input type="hidden" id="activityId" name="activityId" th:value="${activity.activityId}"/>
            <input type="hidden" name="productPrice" th:value="${activity.discountPrice}" />
            <div class="m-slide">
                <div class="view fl">
                    <ul class="Bview">
                        <li th:each="skus,itemStat :${activity.product.getSkus()}" th:if="${itemStat.count}==1"><img th:src="@{${skus.imgSrc}}" /></li>

                        <li class="view-2" th:each="skus,itemStat :${activity.product.getSkus()}" th:if="${itemStat.count}>1"><img th:src="@{${skus.imgSrc}}" /></li>

                    </ul>
                    <ul class="Sview">
                        <li  th:each="skus,itemStat :${activity.product.getSkus()}"><img style="width: 100% ; height: 100%;" th:src="@{${skus.imgSrc}}" /></li>

                    </ul>

                </div>
                <div class="m-info fl">
                    <div class="better fr">
                        <p style="color: #E36844; font-size: 20px;">99%</p>
                        <p style="font-size: 13px;">好评率</p>
                    </div>

                    <div class="intro fl">
                        <div class="detailTag">
                            新品
                        </div>
                        <div class="name"><span th:text="${activity.product.productName}"></span></div>
                        <div class="desc">首发用券立省400元</div>
                    </div>
                    <div class="clear"></div>
                    <div class="m_info">
                        <span style="font-size: medium">限时购&nbsp;&nbsp;</span>
                        <span style="font-size: smaller">距优惠结束&nbsp;&nbsp;</span>
                        <span id="dv"></span>
                        <a th:href="@{/activity/time-buy-list}" style="font-size:small;float: right;color: #fff0ff;cursor: pointer">更多抢购>&nbsp;</a>
                    </div>


                    <div class="m-price" style="margin-bottom: 20px">
                        <div class="f-clearfix">
                            <span style="font-size: 13px; padding-right: 20px;">价格</span>
                            <span style="font-size: 18px; color: red;">￥</span>
                            <span style="font-size: 28px; color: red; font-weight: 700;" th:text="${activity.discountPrice}"></span>
                            <span style="font-size: 15px; color: grey; font-weight: 700;text-decoration:line-through;margin-left: 10px"  th:text="${activity.product.productPrice}"></span>
                        </div>
                        <div class="field">
                            <ul>
                                <li><span style="font-size: 13px; padding-right:20px ;">领券</span>
                                    <img class="ph1" th:src="@{/img/pl-1_03.png}" />
                                    <img class="ph2" th:src="@{/img/pl-1_06.png}" />
                                    <span style="border-bottom: 1px solid red; border-top: 1px solid red; background-color: floralwhite; padding: 0 3px; font-size: 13px;">四百元直减券</span>
                                </li>
                                <li>
                                    <img class="ph3" th:src="@{/img/pl-1_03.png}" />
                                    <img class="ph4" th:src="@{/img/pl-1_06.png}" />
                                    <span style="border-bottom: 1px solid red; border-top: 1px solid red; background-color: floralwhite; padding: 0 3px; font-size: 13px;">全场满639减64</span>
                                </li>
                                <li>
                                    <img class="ph5" th:src="@{/img/pl-1_03.png}" />
                                    <img class="ph6" th:src="@{/img/pl-1_06.png}" />
                                    <span style="border-bottom: 1px solid red; border-top: 1px solid red; background-color: floralwhite; padding: 0 3px; font-size: 13px;">全场满199减19</span>
                                </li>
                                <li>
                                    <a style="font-size: 13px; padding-left: 5px;" href="#">立即领取></a>
                                </li>
                            </ul>
                        </div>
                        <div style="padding-bottom: 10px;" class="f-field">
                            <span style="font-size: 13px; padding-right: 20px;">积分</span>
                            <span style="font-size: 13px;">购买最高得319积分</span>
                        </div>
                        <div class="f-bar">
                        </div>
                        <div style="padding-bottom: 20px;" class="policyBox" th:if="${activity.product.productYoufei}==0.00">
                            <span style="font-size: 13px; padding-right:20px ;">服务</span>
                            <a href="">
                                <span style="font-size: 13px;">.支持7天无忧退货</span>
                                <span style="font-size: 13px; padding-left: 20px;">.四十八小时快速退款</span>
                                <span style="font-size: 13px; padding-left: 20px; padding-right: 70px;color: #9c3328" th:text=".全场包邮"></span>
                                <span style="font-size: 13px; padding-left: 50px;">.网易自营品牌</span>
                                <span style="font-size: 13px; padding-left: 20px;">.国内部分地区无法配送</span>
                            </a>
                        </div>
                        <div style="padding-bottom: 20px;" class="policyBox" th:if="${activity.product.productYoufei}!=0.00">
                            <span style="font-size: 13px; padding-right:20px ;">服务</span>
                            <a href="">
                                <span style="font-size: 13px;">.支持7天无忧退货</span>
                                <span style="font-size: 13px; padding-left: 20px;">.四十八小时快速退款</span>
                                <span style="font-size: 13px; padding-left: 20px; padding-right: 70px;color: #9c3328 "  th:text="'.邮费只需'+${activity.product.productYoufei}"></span>
                                <span style="font-size: 13px; padding-left: 50px;">.网易自营品牌</span>
                                <span style="font-size: 13px; padding-left: 20px;">.国内部分地区无法配送</span>
                            </a>
                        </div>
                    </div>
                    <span id="show"></span>


                    <!--款式-->
                    <div style="position: relative;" class="specProp">
                        <span style="padding-left: 10px;line-height: 50px; vertical-align: middle;">款式</span>
                        <img class="design" style=" margin-left: 20px; vertical-align: middle; " th:src="@{/img/xm-6.png}" />
                        <img class="selected" th:src="@{/img/sys_item_selected.gif}" />
                    </div>
                    <!--数量-->
                    <div class="m-number">
                        <span class="fl" style="padding-left: 10px;line-height: 50px; vertical-align: middle;">数量</span>
                        <div class="u-selnum fl">
                            <button id="numReduce"  type="button" class="u-less fl"> - </button>
                            <input class="fl" id="inputt" style=" text-align: center; outline: none; color: #333333; width: 60px; height: 34px; border: 0.5px solid #DEDEDE;"  type="text" value="1" name="productCount"/>
                            <button id="numAdd" type="button" class="u-more fl"> + </button>
                            <div class="clear"></div>
                        </div>
                        <div class="clear"></div>
                        <span class="fl" style="padding-left: 10px;line-height: 50px; vertical-align: middle;">库存</span>
                        <span id="kucun" class="fl" style="padding-left: 30px;line-height: 50px; vertical-align: middle;color: #00a157; font-size: medium" th:text="${activity.product.getProductCount()}"></span>
                        <div class="clear"></div>
                    </div>
                    <!---->
                    <!--购买-->
                    <div style="margin-top: 30px;" class="u-buy">
                        <!--<button style="margin-left: 10px;" class="u-buys fl" type="submit" ><span>立即购买</span> </button>-->
                        <button id="nowBuy" style="margin-left: 10px;cursor:pointer" class="u-buys fl" type="submit" ><span>立即购买</span></button>
                        <a style="margin-left: 10px; "  id="add_shopping_cart" class="u-bus fl"  href="javascript:void(0)" th:onclick="jiaru([[${activity.productId}]],[[${session.customerId}]])"><span><img style="padding-right: 5px;" th:src="@{/img/xbt-7_02.png}"/>加入购物车</span></a>
                        <p style="margin-left: 10px;" class="u-collect fl"><img class="c-star1 tran5" th:src="@{/img/c-star2_02.png}" /><span class="have2 tran5">收藏</span><img class="c-star2 tran5" th:src="@{/img/c-star2_05.png}" /><span class="have tran5">已收藏</span> </p>
                        <div class="clear"></div>
                    </div>
                </div>
                <div class="clear"></div>
            </div>
        </form>


    </div>

    <!-- Swiper -->
    <div class="swiper-container">
        <div style="color: #000000; font-size: 17px; padding: 10px;" class="swiper-hd">
            大家都在看
        </div>
        <div class="swiper-wrapper">

            <div style="overflow: hidden; height: 290px;" class="swiper-slide">
                <div class="u-photo tran5">
                    <a href="goods-details.html"><img class="tran5" th:src="@{/img/up-1.png}" /></a>
                    <div class="prdtTags">
                        <span>新品</span>
                    </div>
                    <h4 class="u-name"><a href="goods-details.html">网易制造X1舒耳蓝牙耳机</a></h4>
                    <p style="padding-top: 3px; font-size: 14px; vertical-align: middle;">￥73
                        <a href="shopping-cars.html"><img style="vertical-align: middle;" th:src="@{/img/xm-13.png}" /></a>
                    </p>

                </div>

            </div>
            <div style="overflow: hidden; height: 290px;" class="swiper-slide">
                <div class="u-photo tran5">
                    <a href="goods-details.html"><img style="width: 210px;" class="tran5" th:src="@{/img/up-2.png}" /></a>
                    <div class="prdtTags">
                        <span>新品</span>
                    </div>
                    <h4 class="u-name"><a  href="goods-details.html">韩国制造 超声波去角质离子导入美容仪</a></h4>
                    <p style="; padding-top: 3px; font-size: 14px; vertical-align: middle;">￥269
                        <a href="shopping-cars.html"><img style="vertical-align: middle;" th:src="@{/img/xm-13.png}" /></a>
                    </p>

                </div>

            </div>
            <div style="overflow: hidden; height: 290px;" class="swiper-slide">
                <div class="u-photo tran5">
                    <a href="goods-details.html"><img class="tran5" th:src="@{/img/up-3.png}" /></a>
                    <div class="prdtTags">
                        <span>新品</span>
                    </div>
                    <h4 class="u-name"><a href="goods-details.html">全净皓齿变速式声波电动牙刷</a></h4>
                    <p style="padding-top: 3px; font-size: 14px; vertical-align: middle;">￥219
                        <a href="shopping-cars.html"><img style="vertical-align: middle;" th:src="@{/img/xm-13.png}" /></a>
                    </p>

                </div>

            </div>
            <div style="overflow: hidden; height: 290px;" class="swiper-slide">
                <div class="u-photo tran5">
                    <a href="goods-details.html"><img class="tran5" th:src="@{/img/up-4.png}" /></a>
                    <div class="prdtTags">
                        <span>新品</span>
                    </div>
                    <h4 class="u-name"><a href="goods-details3.html">金属跟搭带女跟鞋</a></h4>
                    <p style="padding-top: 3px; font-size: 14px; vertical-align: middle;">￥299
                        <a href="shopping-cars.html"><img style="vertical-align: middle;" th:src="@{/img/xm-13.png}" /></a>
                    </p>

                </div>

            </div>

        </div>

        <!-- Add Arrows -->
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
    </div>

    <div style="" class="left fl">
        <!--选项卡-->
        <div class="tab" id="tab1">
            <ul class="tab-title active" >
                <li class="active fl">详情</li>
                <li class="fl">评价</li>
                <li class="fl">常见问题</li>
                <div class="clear">

                </div>
            </ul>
            <ul style="height: 100%;" class="tab-content m-attrList" id="">
                <li>
                    <div class="details">
                        <p class="fl">产品详情 <span>130mm*130mm*130mm</span></p>
                        <p class="fl">材质 <span style="padding-left: 100px;">ABS+铝合金+珠光漆</span></p>
                        <div class="clear">

                        </div>
                    </div>
                    <div class="consume">
                        <p class="fl">功耗<span>45W</span></p>
                        <p style="padding-left: 144px;" class="fl">电源适配器 <span style="padding-left: 57px;">19V/3.4A</span></p>
                        <div class="clear">

                        </div>
                    </div>
                    <div class="battery">
                        <p class="fl">电池容量 </p><span class="fl" style="width: 350px">16000mAH大容量 音乐播放7小时、电影播放2.5小时。充电时长约2小时，充电期间产品正常使用。</span>
                        <div class="clear">

                        </div>
                    </div>
                    <div class="after-sale">
                        <p>售后服务 </p>
                        <span>本品支持7天无理由退换货。</span>
                        <span>自用户签收之日起，15日内如本产品出现质量问题，用户可选择换货。</span>
                        <span>自用户签收之日起，1年内如本产品出现质量问题，用户可将产品寄回严选免费保修，严选承诺收到产品后3个工作日内完成维修或换新寄出产品，运费由严选承担；若非质量问题引起故障，维修费用和运费则需用户自行承担。</span>
                        <span>4.首次使用时如电量不足请及时充电，充电期间产品正常使用。</span>
                        <span>5. 如您需购买麦克风、游戏手柄等用于本投影仪的配件，建议咨询客服购买推荐款式（已适配确认可用），以免自行购买款式无法适用。</span>

                    </div>
                    <div class="hint">
                        <p>售后服务 </p>
                        <span>1.7天无忧退换货说明：产品、配件需保持完好，无磨损、污渍。包材、说明书齐全不影响二次销售。</span>
                        <span>2.本品赠送定制三脚架，三脚架顶部360度云台可随意调整投影仪角度，旋转三脚架中部可实现三脚架两档高度调整。</span>
                        <span style="width: 700px;">3.因网络信号、互联网电视政策限制导致的使用问题不属于投影仪质量问题，产品使用问题欢迎咨询严选客服。</span>
                    </div>
                    <img th:src="@{/img/xm-12-1.jpg}" />
                    <img th:src="@{/img/xm-12-2.png}" />
                    <img th:src="@{/img/xm-12-3.png}" />
                </li>
                <li style="padding-top: 27px">
                    <div class="m-goodRates fl">
                        <div class="label">好评率</div>
                        <div class="goodRate">90.3%</div>
                        <div class="m-score">
                            <img width="14px" th:src="@{/img/qq_06(1).png}" />
                            <img width="14px" th:src="@{/img/qq_06(1).png}" />
                            <img width="14px" th:src="@{/img/qq_06(1).png}" />
                            <img width="14px" th:src="@{/img/qq_06(1).png}" />
                            <img width="14px" th:src="@{/img/qq_06(1).png}" />
                        </div>
                    </div>
                    <div class="m-commentNav fl">
                        <div class="title">大家都在说：</div>
                        <div class="labelList"> <span class="label active " data-name="全部" data-type="1">全部（31）</span> <span class="label  " data-name="有图" data-type="0">有图（16）</span> <span class="label  " data-name="追评" data-type="0">追评（4）</span> </div>
                    </div>
                    <div class="clear">
                    </div>
                    <div class="m-bar">

                    </div>
                    <div class="m-sorts"> <span class="name">排序：</span>
                        <a href="javascript:;" class="sort ">默认</a>
                        <a href="javascript:;" style="color: black;" class="sort ">评价时间 <i class="w-icon"></i></a>
                    </div>
                    <div class="m-commentUser">
                        <div class="t-img fl">
                            <img style="border-radius: 50px;" width="50px" th:src="@{/img/user-1.jpeg}" />
                            <div class="username-withIcon">
                                <a class="w-icon-member" href="#"><img style="vertical-align: middle;" th:src="@{/img/V-1.png}" /><span class="username">b****0</span></a>
                            </div>
                        </div>
                        <div class="m-commentItem fl">
                            <div class="m-score">
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                            </div>
                            <div class="skuInfo"> <span class="mr20">款式:便携</span> </div>
                            <div class="m-content"> 效果绝对好，轻便颜值高。就是有些矫正和移动硬盘读取还在研究中 </div>
                            <div class="m-picList" style="display: inline-block;">
                                <img th:src="@{/img/pj-z.jpg}" />
                                <img th:src="@{/img/pj-z.jpg}" />
                                <img th:src="@{/img/pj-z.jpg}" />
                            </div>
                            <div class="m-picList-big">
                                <!-- Swiper -->
                                <div class="swiper-container c">
                                    <div style="font-size: 28px;" class="m-del fr">
                                        <span style="cursor: pointer;">×</span>
                                    </div>
                                    <div class="clear">

                                    </div>
                                    <div class=".c swiper-wrapper">

                                        <div style="padding: 10px;" class=".c swiper-slide">
                                            <img height="400px" th:src="@{/img/pj-2.jpg}" />
                                        </div>
                                        <div style="padding: 10px;" class="swiper-slide">
                                            <img height="400px" th:src="@{/img/pj-2.jpg}" />
                                        </div>
                                        <div style="padding: 10px;" class="swiper-slide">
                                            <img height="400px" th:src="@{/img/pj-2.jpg}" />
                                        </div>
                                    </div>
                                    <!-- Add Arrows -->
                                    <div class=".c swiper-button-next"></div>
                                    <div class=".c swiper-button-prev"></div>
                                </div>

                            </div>
                        </div>
                        <div class="clear">

                        </div>
                    </div>
                    <div class="m-commentUser">
                        <div class="t-img fl">
                            <img style="border-radius: 50px;" width="50px" th:src="@{/img/user-1.jpeg}" />
                            <div class="username-withIcon">
                                <a class="w-icon-member" href="#"><img style="vertical-align: middle;" th:src="@{/img/V-1.png}" /><span class="username">b****0</span></a>
                            </div>
                        </div>
                        <div class="m-commentItem fl">
                            <div class="m-score">
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                            </div>
                            <div class="skuInfo"> <span class="mr20">款式:便携</span> </div>
                            <div class="m-content"> 效果绝对好，轻便颜值高。就是有些矫正和移动硬盘读取还在研究中 </div>
                            <div class="m-picList" style="display: inline-block;">
                                <img th:src="@{/img/pj-z.jpg}" />
                                <img th:src="@{/img/pj-z.jpg}" />
                                <img th:src="@{/img/pj-z.jpg}" />
                            </div>
                            <div class="m-picList-big">
                                <!-- Swiper -->
                                <div class="swiper-container c">
                                    <div style="font-size: 28px;" class="m-del fr">
                                        <span style="cursor: pointer;">×</span>
                                    </div>
                                    <div class="clear">

                                    </div>
                                    <div class=".c swiper-wrapper">

                                        <div style="padding: 10px;" class=".c swiper-slide">
                                            <img height="400px" th:src="@{/img/pj-2.jpg}" />
                                        </div>
                                        <div style="padding: 10px;" class="swiper-slide">
                                            <img height="400px" th:src="@{/img/pj-2.jpg}" />
                                        </div>
                                        <div style="padding: 10px;" class="swiper-slide">
                                            <img height="400px" th:src="@{/img/pj-2.jpg}" />
                                        </div>
                                    </div>
                                    <!-- Add Arrows -->
                                    <div class=".c swiper-button-next"></div>
                                    <div class=".c swiper-button-prev"></div>
                                </div>

                            </div>
                        </div>
                        <div class="clear">

                        </div>
                    </div>
                    <div class="m-commentUser">
                        <div class="t-img fl">
                            <img style="border-radius: 50px;" width="50px" th:src="@{/img/user-1.jpeg}" />
                            <div class="username-withIcon">
                                <a class="w-icon-member" href="#"><img style="vertical-align: middle;" th:src="@{/img/V-1.png}" /><span class="username">b****0</span></a>
                            </div>
                        </div>
                        <div class="m-commentItem fl">
                            <div class="m-score">
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                                <img width="14px" th:src="@{/img/qq_06(1).png}" />
                            </div>
                            <div class="skuInfo"> <span class="mr20">款式:便携</span> </div>
                            <div class="m-content"> 效果绝对好，轻便颜值高。就是有些矫正和移动硬盘读取还在研究中 </div>
                            <div class="m-picList" style="display: inline-block;">
                                <img th:src="@{/img/pj-z.jpg}" />
                                <img th:src="@{/img/pj-z.jpg}" />
                                <img th:src="@{/img/pj-z.jpg}" />
                            </div>
                            <div class="m-picList-big">
                                <!-- Swiper -->
                                <div class="swiper-container c">
                                    <div style="font-size: 28px;" class="m-del fr">
                                        <span style="cursor: pointer;">×</span>
                                    </div>
                                    <div class="clear">

                                    </div>
                                    <div class=".c swiper-wrapper">

                                        <div style="padding: 10px;" class=".c swiper-slide">
                                            <img height="400px" th:src="@{/img/pj-2.jpg}" />
                                        </div>
                                        <div style="padding: 10px;" class="swiper-slide">
                                            <img height="400px" th:src="@{/img/pj-2.jpg}" />
                                        </div>
                                        <div style="padding: 10px;" class="swiper-slide">
                                            <img height="400px" th:src="@{/img/pj-2.jpg}" />
                                        </div>
                                    </div>
                                    <!-- Add Arrows -->
                                    <div class=".c swiper-button-next"></div>
                                    <div class=".c swiper-button-prev"></div>
                                </div>

                            </div>
                        </div>
                        <div class="clear">
                        </div>
                    </div>
                </li>
                <li>

                    <div class="after-sale">
                        <p>购买运费如何收取？ </p>
                        <span>单笔订单金额（不含运费）满88元免邮费；不满88元，每单收取10元运费。</span>
                        <span>(港澳台地区需满500元免邮费；不满500元，每单收取30元运费)。</span>
                    </div>
                    <div class="hint">
                        <p>网易严选的订单如何配送？</p>
                        <span style="width: 650px;">网易严选会根据商品所在地、顾客所在地和商品的尺寸重量优选物流配送商，确保优质用户体验。目前暂不支持自选快递，具体物流信息可在下单成功后“我的订单-追踪物流”中查看。</span>
                    </div>
                    <div class="after-sale">
                        <p>如何申请退换货？ </p>
                        <span>1.自收到商品之日起30日内，顾客可申请无忧退货；如果是退货，退款将原路返还，不同的银行处理时间不同，预计1-5个工作日到账；</span>
                        <span>2.内裤和食品等特殊商品无质量问题不支持退换货；</span>
                        <span>3.退货流程：</br>
                            确认收货-申请退货-客服审核通过-用户寄回商品-仓库签收验货-退款审核-退款完成；
								</span>

                        <span>4.换货流程：</br>
                            确认收货-申请退货-客服审核通过-用户寄回商品-仓库签收验货-退款审核-退款完成;
								</span>

                        <span>5.退换货运费由网易严选承担（大件商品除外）。上门取件费用由网易严选统一与快递服务商结算，顾客只需将退换货商品交给上门取件快递员寄回。如顾客选择自行寄回商品，请先垫付运费，到货验证商品后，严选将以现金券形式为用户报销运费，不接受单方面到付件。</span>
                    </div>
                    <div class="after-sale">
                        <p>如何开具发票？ </p>
                        <span>1.请在下单时选择“我要开发票”并填写相关信息（APP仅限2.4.0及以上版本）。开具增值税专用发票需在下单时填写增票资质信息。温馨提示：请确保增票资质信息与贵司税务登记证信息一致，避免因开票信息错误给贵司带来损失。</span>
                        <span>2.可选开票内容：</br>
                            依照国税总局开票法规，严选订单开具纸质发票、电子发票，开票内容为明细；礼品卡开票内容为预付卡；增值税专用发票开票内容为明细。</span>
                    </div>
                </li>

            </ul>
        </div>

    </div>
    <div class="right fl">

        <div class="hot-sell">
            <header class="header">24小时热销</header>
            <ul>
                <li><a href="goods-details.html"><img th:src="@{/img/xr-1.png}" /></a>
                    <p>
                        <a style="font-size: 14px; color: #000000;" href="goods-details3.html">严选礼品卡 100元面值</a>
                    </p>
                    <div class="r-price">
                        <span style="font-size: 14px;">￥100</span>
                        <span class="r-bus"><a href="shopping-cars.html"><img th:src="@{/img/xm-13.png}"/></a></span>
                    </div>
                </li>
                <li><a href="goods-details3.html"><img th:src="@{/img/xr-2.png}" /></a>
                    <p>
                        <a style="font-size: 14px; color: #000000;" href="goods-details3.html">谷风一木 小卷纸</a>
                    </p>
                    <div class="r-price">
                        <span style="font-size: 14px;">￥27.9</span>
                        <span class="r-bus"><a href="shopping-cars.html"><img th:src="@{/img/xm-13.png}"/></a></span>
                    </div>
                </li>
                <li style="position: relative;"><a href="goods-details3.html"><img th:src="@{/img/xr-3.png}" /></a>
                    <div class="r-color">
                        十色可选
                    </div>
                    <p>
                        <a style="font-size: 14px; color: #000000;" href="goods-details3.html">玩趣彩虹四季拖鞋</a>
                    </p>
                    <div class="r-price">
                        <span style="font-size: 14px;">￥19.9</span>
                        <span class="r-bus"><a href="shopping-cars.html"><img th:src="@{/img/xm-13.png}"/></a></span>
                    </div>
                </li>
                <li><a href="goods-details3.html"><img th:src="@{/img/xr-4.png}" /></a>
                    <p>
                        <a style="font-size: 14px; color: #000000;" href="goods-details3.html">懒人抹布</a>
                    </p>
                    <div style="border-bottom: 0px;" class="r-price">
                        <span style="font-size: 14px;">￥13.9</span>
                        <span class="r-bus"><a href="shopping-cars.html"><img th:src="@{/img/xm-13.png}"/></a></span>
                    </div>
                </li>
            </ul>
        </div>
        <div class="special">
            <header class="header">专题推荐</header>
            <ul>
                <li style="position: relative;">
                    <a href="goods-details3.html"><img th:src="@{/img/xr-5.png}" />
                        <div class="text">
                            8月24日新品放映室
                        </div>
                    </a>

                </li>
                <li style="position: relative;">
                    <a href="goods-details3.html"><img th:src="@{/img/xr-6.png}" />
                        <div class="text">
                            吃得到果肉的，才是真凤梨酥
                        </div>
                    </a>

                </li>
                <li style="position: relative;">
                    <a href="goods-details3.html"><img th:src="@{/img/xr-7.png}" />
                        <div class="text">
                            宝贝开学总动员
                        </div>
                    </a>

                </li>
                <li style="position: relative;">
                    <a href="goods-details3.html"><img th:src="@{/img/xr-8.png}" />
                        <div class="text">
                            别提起好水，你只知道依云
                        </div>
                    </a>

                </li>

            </ul>
        </div>

    </div>
    <div class="clear">

    </div>
</div>
<div class="tab2">
    <div class="container">
        <ul>
            <li>详情</li>
            <li>评价</li>
            <li>常见问题</li>
        </ul>
    </div>
</div>
<div th:replace="footer::#footbar"></div>
<script th:src="@{/js/swiper.min.js}" src="js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
<script th:src="@{/js/swiper-4.3.5.min.js}" src="js/swiper-4.3.5.min.js" type="text/javascript" charset="utf-8"></script>
<script th:src="@{/js/jquery-3.3.1.min.js}" src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
<script th:src="@{/layer-v3.1.1/layer/layer.js}" src="layer-v3.1.1/layer/layer.js" type="text/javascript" charset="utf-8"></script>

<script type="text/javascript" th:inline="javascript">
    function runOnBefore() {
        window.onbeforeunload =function (){
            return '丢失重要数据'
        }
    }
    var dv=document.getElementById("dv");

    function change(a){
        if(a<10)
            return a="0"+a;
        return a;
    }

    // var loopInterval = setInterval(function(){
    //     //alert([[${activity.timeEnd}]])
    //     var endTime=new Date([[${activity.timeEnd}]]);
    //     dateFormat('yyyy-MM-dd HH:mm:ss',endTime)
    //     //alert(endTime)
    //     end=endTime.getTime();
    //     var nowTime=new Date();
    //     var lastTime=endTime.getTime()-nowTime.getTime();  //获得毫秒差数
    //     var day=Math.floor(lastTime/(1000*60*60*24));
    //     var hour=Math.floor(lastTime/(1000*60*60)%24);
    //     var min=Math.floor(lastTime/(1000*60)%60);
    //     min=change(min);
    //     var second=Math.floor(lastTime/1000%60);
    //     second=change(second);
    //     //console.log(lastTime) //打印剩余毫秒数
    //     if(lastTime <= 0.0){
    //         clearInterval(loopInterval)
    //         //layer.msg("限时活动已经结束",{time:5000})
    //         $("#dv").html("<a href='/' id = 'transformPage'>该商品限时活动已经结束,进入首页继续浏览<a/>");
    //         $("#nowBuy").attr({"disabled":"true"}).css({"backgroundColor":"gray"})
    //         $("#nowBuy span").text("活动已结束")
    //         $("#add_shopping_cart").attr({"href":"#"}).css({"backgroundColor":"gray"})
    //         var productId = $("#productId").val()
    //         var activityId = "123123"
    //
    //         //删除已经过时的活动商品
    //         activityId=$('#activityId').val();
    //         //alert(activityId)
    //         $.ajax({
    //             url: "/product/activityDelete?activityId="+activityId,
    //             method: 'POST',
    //             traditional: true,
    //             success: function (json) {
    //                 layer.msg("限时活动已经结束",{time:4000})
    //                 show()
    //             }
    //         });
    //         return;
    //     }
    //     var mes="还剩下"+day+"天"+hour+"小时"+min+"分"+second+"秒";
    //     dv.innerHTML=mes;
    //     //删除已经过时的活动商品
    //     activityId=$('#activityId').val();
    //     //alert(activityId)
    //     $.ajax({
    //         url: "/activity/activityDelete?activityId="+activityId,
    //         method: 'POST',
    //         traditional: true,
    //         success: function (json) {
    //             layer.msg("限时活动已经结束",{time:4000})
    //             show()
    //         }
    //     });
    //     return;
    // }
    // var mes="还剩下"+day+"天"+hour+"小时"+min+"分"+second+"秒";
    // dv.innerHTML=mes;
    //
    // },1000);

    var loopInterval = setInterval(function(){
        //alert([[${activity.timeEnd}]])
        var endTime=new Date([[${activity.timeEnd}]]);
        dateFormat('yyyy-MM-dd HH:mm:ss',endTime)
        //alert(endTime)
        end=endTime.getTime();
        var nowTime=new Date();
        var lastTime=endTime.getTime()-nowTime.getTime();  //获得毫秒差数
        var day=Math.floor(lastTime/(1000*60*60*24));
        var hour=Math.floor(lastTime/(1000*60*60)%24);
        var min=Math.floor(lastTime/(1000*60)%60);
        min=change(min);
        var second=Math.floor(lastTime/1000%60);
        second=change(second);
        //console.log(lastTime)
        if(lastTime <= 0.0){
            clearInterval(loopInterval)
            //layer.msg("限时活动已经结束",{time:5000})
            $("#dv").html("<a href='/' id = 'transformPage'>该商品限时活动已经结束,进入首页继续浏览<a/>");
            $("#nowBuy").attr({"disabled":"true"}).css({"backgroundColor":"gray"})
            $("#nowBuy span").text("活动已结束")
            $("#add_shopping_cart").attr({"href":"#"}).css({"backgroundColor":"gray"})
            var productId = $("#productId").val()
            var activityId = "123123"

            //删除已经过时的活动商品
            activityId=$('#activityId').val();
            //alert(activityId)
            $.ajax({
                url: "/activity/activityDelete?activityId="+activityId,
                method: 'POST',
                traditional: true,
                success: function (json) {
                    layer.msg("限时活动已经结束",{time:4000})
                    show()
                }
            });
            return;
        }
        var mes=day+" 天 "+hour+" 时 "+min+" 分 "+second+" 秒 ";
        dv.innerHTML=mes;

    },1000);
    function show() {
        var i=5;
        var t=document.getElementById('transformPage');
        t.innerHTML ="该商品限时活动已经结束"+ i+'秒后跳转回首页';
        setInterval(function () {
            t.innerHTML="该商品限时活动已经结束"+--i+'秒后跳转回首页';
            if(i==0){
                location.href='http://localhost:8180/'
            }
        },1000)
    }
    function dateFormat(fmt,date) {
        var o = {
            "M+" : date.getMonth()+1,     //月份
            "d+" : date.getDate(),     //日
            "h+" : date.getHours(),     //小时
            "m+" : date.getMinutes(),     //分
            "s+" : date.getSeconds(),     //秒
            "q+" : Math.floor((date.getMonth()+3)/3), //季度
            "S" : date.getMilliseconds()    //毫秒
        };
        if(/(y+)/.test(fmt))
            fmt=fmt.replace(RegExp.$1, (date.getFullYear()+"").substr(4 - RegExp.$1.length));
        for(var k in o)
            if(new RegExp("("+ k +")").test(fmt))
                fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
        return fmt;
    }
</script>

<script type="text/javascript">
    var flag = true
    $('.u-collect').click(function() {

        if(flag) {
            $('.c-star1').css('transform', 'translateY(-17px)')
            $('.c-star2').css('transform', 'translateY(-48px)')
            $('.have2').css('opacity','0')
            $('.have').css('opacity','1')
            flag=false
        }else {
            $('.c-star1').css('transform', 'translateY(2px)')
            $('.c-star2').css('transform', 'translateY(17px)')
            $('.have2').css('opacity','1')
            $('.have').css('opacity','0')
            //配置一个透明的询问框
            layer.msg('取消收藏', {
                time: 2000, //2s后自动关闭
            });
            flag=true
        }

    })
</script>

<script type="text/javascript">
    $(window).scroll(function() {
        var top = $(document).scrollTop();
        if(top > 1200.5) {
            $('.navigation-fix').slideUp().remove()
            $('.tab2').css('display', 'block')
            $('.tab2').slideDown()

        } else {
            $('.tab2').slideUp()
            $('.tab2').css('display', 'none')
        }

    })
</script>

<script type="text/javascript">
    $('.Sview li').hover(function() {
        $('.Sview li').css('border', 'none')
        $(this).css('border', '1px solid red')
        var i = $(this).index();
        $(this).parent().siblings('.Bview').children('li').css('display', 'none');
        $(this).parent().siblings('.Bview').children('li').eq(i).css('display', 'block')
    })
</script>

<script type="text/javascript">
    var flag = true;
    $('.specProp img').click(function() {
        if(flag) {
            $(".selected").css({
                display: 'block'
            });
            $('.design').css({
                border: '0.5px solid red'
            });
            flag = false
        } else {
            $(".selected").css({
                display: 'none'
            });
            $('.design').css({
                border: '0px'
            });
            flag = true
        }
    })
</script>
<script type="text/javascript">
    // $('.u-selnum').each(function() {
    //     var oInput = $('input')
    //     var oNum = 1
    //     $('.u-more').click(function() {
    //         oNum = $('#inputt').val();
    //         oNum++;
    //         $('#inputt').val(oNum)
    //         $("#add_shopping_cart").attr("href","/shoppingcart/addcars?productId=[[${activity.productId}]]&customerId=[[${session.customerId}]]&count="+oNum)
    //     })
    //     $('.u-less').click(function() {
    //         if(oNum > 1) {
    //             oNum--;
    //             $('#inputt').val(oNum)
    //             $("#add_shopping_cart").attr("href","/shoppingcart/addcars?productId=[[${activity.productId}]]&customerId=[[${session.customerId}]]&count="+oNum)
    //         }
    //
    //     })
    // })
</script>

<!--轮播-->
<script>
    var swiper = new Swiper('.swiper-container', {
        slidesPerView: 4,
        spaceBetween: 10,
        slidesPerGroup: 4,
        loop: true,
        loopFillGroupWithBlank: true,

        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
    });
</script>
<!--轮播2-->
<!-- Initialize Swiper -->
<script>
    var swiper = new Swiper('.c', {
        slidesPerGroup: 1,
        navigation: {
            nextEl: '.c .swiper-button-next',
            prevEl: '.c .swiper-button-prev',
        },
    });
</script>

<script type="text/javascript">
    $('.m-commentUser img').click(function() {
        $(this).parent().siblings('.m-picList-big').find('.c').css('display', 'block')
    })
</script>
<script type="text/javascript">
    $('.m-del span').click(function() {
        $(this).parents('.c').css('display', 'none')
    })
</script>
<!--选项卡-->
<script type="text/javascript">
    $('.tab-title li').click(function() {
        //切换active
        $(this).siblings().removeClass('active');
        $(this).addClass('active');
        var i = $(this).index();
        //				console.log(i)
        $(this).parent().siblings('.tab-content').find('li').css('display', 'none')
        $(this).parent().siblings('.tab-content').find('li').eq(i).css('display', 'block');

    })



</script>
<!-- 判断自己选择的商品是否超过库存 -->
<script type="text/javascript">
    $(function () {
        $("#numAdd").off().on('click',function () {
            $.ajax({
                cache : false,
                type : "POST",
                url : "/product/numAdd?num="+$("#inputt").val() +"&productId="+$("#productId").val(),
                async : true,
                success:function(data) {
                    if (data == "") {
                        var i = parseInt($("#inputt").val()) + 1;
                        $("#inputt").val(i);
                    }else {
                        layer.msg("没货啦,亲~");
                        $("#inputt").val(data);
                    }
                }
            })
        })
    })
</script>
<!-- 判断自己选择的商品数量是否小于1-->
<script type="text/javascript">
    $(function () {
        $("#numReduce").off().on('click',function () {
            $.ajax({
                cache : false,
                type : "POST",
                url : "/product/numReduce?num="+$("#inputt").val(),
                async : true,
                success:function(data) {
                    if (data == "") {
                        var i = parseInt($("#inputt").val()) - 1;
                        $("#inputt").val(i);
                    }else {
                        layer.msg("不能小于1件商品哦");
                        $("#inputt").val(data);
                    }
                }
            })
        })



        /**
         * 立即购买之前的判断
         */
        function buyJudgment() {
            var count = $("#inputt").val();
            var kucun = $("#kucun").text();
            if (parseInt(count) > parseInt(kucun)){
                layer.msg("商品没货啦，再逛逛吧");
                return false;
            }else {
                return true;
            }
        }
    })
</script>
<script>
    /**
     * 加入购物车
     */
    function jiaru(productId,customerId) {
        //alert(111)
        var count = $("#inputt").val();
        var kucun = $("#kucun").text();
        var flag = 0;
        if (parseInt(count) > parseInt(kucun)){
            layer.msg("购物车中货物太多,商品没货啦,再逛逛吧~");
        }else {
            $.ajax({
                cache : false,
                type : "POST",
                url : "/shoppingcart/panduan?productId="+productId+"&count="+count,
                async : true,
                success:function(data) {
                    if (data == "error") {
                        // layer.msg("购物车中已经存在该商品",{time:1000});
                        layer.msg("购物车中货物太多，库存中该商品数量不足了，亲~",{icon: 5,time:1000,area:['300px', '88px']});
                        $("#inputt").val("1");
                    }else if(data == "success"){
                        flag = 1;
                        jiarugouwuche(productId,customerId,count,flag);
                    }else {
                        flag = 2;
                        jiarugouwuche(productId,customerId,count,flag);
                    }
                }
            })
        }
    }

    function jiarugouwuche(productId,customerId,count,flag) {
        window.location.href ="/shoppingcart/addcars?productId="+productId+ "&customerId="+customerId+"&count="+count+"&flag="+flag;
    }
</script>
</body>

</html>